<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <title>Formula 1</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        
        <!--JavaScript-->
        <script type="text/javascript" src="scripts/jquery_110.js"></script>
	<script type="text/javascript" src="scripts/script_canvas.js"></script>
        <script type="text/javascript" src="scripts/multimedia.js"></script>
        <script type="text/javascript" src="scripts/script_login_local.js"></script>
        <script type="text/javascript" src="scripts/script_worker.js"></script>
        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
        <script type="text/javascript" src="scripts/script_mapa.js"></script>
    
        <!--Estilos-->
        <link rel="stylesheet" type="text/css" href="css/estilos_contenido.css">
        <link rel="stylesheet" type="text/css" href="css/menu.css">
        <link rel="stylesheet" type="text/css" href="css/estiloMultimedia.css">
    </head>
    
    <body>
        <div id="wrap">  
            
            <header>
                <a id="text">Inicio | Acceso | Contacto</a>
      <svg width="1200" height="100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                <image x="0" y="0" width="1000" height="100" xlink:href="imagenes/banner3.jpg" />
        </svg>
            </header>
            <audio id="pausaSonido" src="Multimedia/Formula1_Abu.mp3" autoplay="autoplay" loop></audio>
           
                <button id="botonPausar" onclick="PlayPause(this,'pausaSonido');">Pausar Sonido</button>
          
            <nav>
                <ul id="menu">
                     <li><a href="#">Inicio</a></li>
                    <li><a href="#">Carreras</a></li>
                    <li><a href="#">Pilotos</a></li>
                    <li><a href="#">Contacto</a></li>
                 </ul>
            </nav>
            
            <article>                       
            <aside id="login">
                   <div id="1" class="div_perfil" draggable="true">	
                     <canvas id="cnv-forma-1" class="cnv_perfil" draggable="false" width="100" height="100">
                     Tu navegador no soporta canvas
                     </canvas>
                    </div>
                    <div id="2" class="div_perfil" draggable="true">
                            <canvas id="cnv-forma-2" class="cnv_perfil" draggable="false" width="100" height="100">
                            Tu navegador no soporta canvas
                            </canvas>
                    </div>
                    <div id="3" class="div_perfil" draggable="true">
                            <canvas id="cnv-forma-3" class="cnv_perfil" draggable="false" width="100" height="100">
                            Tu navegador no soporta canvas
                            </canvas>
                    </div><br/>
                    <div id="perfil">
                            <canvas id="cnv-forma-4" class="cnv_perfil" draggable="false" width="100" height="100">
                            Tu navegador no soporta canvas
                            </canvas>
                    </div><br/>
                    <div id="datos_usuario">
                            Nombre:	<input id="n_usr" type="text" name="nombre"><br/><br/>
                            Hombre <input id="hombre" type="radio" name="genero" value="Hombre" checked="checked"> Mujer <input id="mujer" type="radio" name="genero" value="Mujer"><br/>
                            <button id="save">Guardar</button>
                            <p id="mensaje_registro"> Para cambiar tu imagen deberás actualizar la página</p>

                    </div>
                    
                </aside>
                
                <div id="cont_grafica">	
                    <canvas id="graficas" width="500" height="300">
                            Tu navegador no soporta el elemento canvas de HTML5
                    </canvas>
                    <div id="menu-canvas">
                                <h5>Elige un canvas</h5>
                        <ul>			
                                <li class="opcion_cnv" id="gpoligono">Poligonal</li>
                                <li class="opcion_cnv" id="gbarra">Barras</li>
                                <li class="opcion_cnv" id="gpastel">Pastel</li>
                                
                        </ul>
                    </div>
                </div>
                <aside>    
                    <h2 class="stilo">Videos</h2>
                    <div id="video_html5">
                    <video id="MiVideo" class ="video" src="Multimedia/F1_2013_promo.mp4"> </video>
                    </div>
                    <div class="ContenedorImagenesAside"> 
                        <div id="video1" class="imgVideo1" onclick="Video2()"> </div>
                        <div id="video2" class="imgVideo2" onclick="PromoF1()"> </div>
                    </div>
                    
                    <div id="BarraBotonesControl">
                        <button onclick="Reproducir()">Play</button>
                        <button onclick="Pausar('MiVideo')">Pause</button>
                        <button onclick="Stop()">Detener</button>
                    </div>
                </aside>
                            
            <div>
                <section id="imagen1"></section>
                <article>
                        <h3>Circuito de Albert Park</h3>
                            <label id="Reloj"> </label>
                        <p class="parrafo">
                            <time datetime="2013-10-19">19 de Octubre del 2013</time><br/>
                            Es un circuito de carreras callejero que se monta en los alrededores del lago Albert Park, 
                            al sur de la ciudad de Melbourne, Australia. Alberga anualmente desde 1996 el Gran Premio de
                            Australia de Fórmula 1.<br>
                            A pesar de ser un trazado urbano (o semiurbano, ya que muchas de las calles han sido remodeladas
                            con el Gran Premio en mente), la pista es relativamente ancha y rápida. El circuito es bastante
                            liso en comparación con otras pistas de la máxima categoría, y ofrece algunas oportunidades de 
                            adelantamiento. Lamentablemente, el terreno llano y las barreras de seguridad impiden tener una 
                            buena vista del trazado, con la excepción de las tribunas.
                            
                        </p>
                </article>
            </div>
                
                <aside>
                    <h3>Proxima Carrera</h3>
                    <table>
                        <tr>
                            <td>Carrera:</td>
                            <td>Gp  de India</td>
                        </tr>
                        <tr>
                            <td>Circuito:</td>
                            <td>Nueva Delhi</td>
                        </tr>
                        <tr>
                            <td>País:</td>
                            <td> <img src="imagenes/india.jpg" alt="Bandera India"/> India</td> 
                        </tr>
                        <tr>
                            <td>Fechas:</td>
                            <td>Del 25 al 27 de Octubre 2013</td> 
                        </tr>
                        <tr>
                            <td>Longitud</td>
                            <td>5.125 kms</td>
                        </tr>

                        <tr>
                            <td>Vueltas</td>
                            <td>60 vueltas</td>
                        </tr>
                        <tr> <td>Distancia</td>
                             <td>307.500 kms</td>
                        </tr>
                        <tr> <td>Record vuelta:</td>
                             <td>1:27.249 - S Vettel (2011)</td>
                        </tr>
                        <tr> <td>Hora Mexico:</td>
                             <td> 3:30</td>
                        </tr>
                    </table>
                </aside>
                
            <div>
                <section id="imagen2"> </section>
                <article>        
                    <h3>Circuito de Yas Marina</h3>
                    <label id="Reloj1"> </label>
                    <p class="parrafo">
                        <time datetime="2013-10-20">20 de Octubre del 2013</time><br/>
                         Es un circuito de carreras que se construyó en la Isla Yas, emirato de Abu Dabi, Emiratos Árabes 
                         Unidos para celebrar el Gran Premio de Abu Dabi de Fórmula Uno desde el año 2009.
                         El trazado de Gran Premio mide 5.554 metros de longitud, y cuenta con suficientes focos de luz para
                         celebrar carreras de noche con iluminación de estadio, algo poco habitual en circuitos tan largos. 
                         Existe un trazado reducido a 4.700 metros; asimismo, el circuito cuenta con dos circuitos independientes
                         con sendas calles de boxes.<br>
                         El circuito se caracteriza por contar con novedades tecnológicas que podrán servir de referencia para 
                         otros trazados. Una de sus mayores novedades es que el pit-lane, en la parte de la salida de boxes a pista,
                         cruza la pista por debajo, para conseguir más seguridad en la incorporación de los monoplazas a la misma y 
                         para aprovechar el espacio.
                    </p>
                </article>
            </div>
                
                    
                        <aside id="texto_worker">
                    <div id="worker_1"></div>
                    <div id="worker_2"></div>
                    <div id="worker_3"></div>
                </aside>                 
                
                
            <div>
                <section id="imagen3"> </section>
                <article>
                    <h3>Sebastian Vettel</h3>
                    <label id="Reloj2"> </label>
                        <p class="parrafo">
                            <time datetime="2013-10-15">15 de Octubre del 2013</time><br/>
                            Piloto alemán y actual campeón del mundo de Fórmula 1. Compite para el equipo Red Bull, junto a Mark Webber
                            desde 2009, después de haber debutado con BMW Sauber y participado en 2007 y 2008 con el equipo Toro Rosso 
                            (filial de Red Bull).El piloto resultó subcampeón del Campeonato Mundial de Fórmula 1 de 2009 y se alzó con 
                            el título en 2010, 2011 y 2012, convirtiéndose en el piloto más joven de la historia en ser tricampeón de la
                            máxima categoría de automovilismo. A 13 de octubre de 2013, lleva acumuladas 35 victorias, 58 podios y 42 
                            pole positions. Es el cuarto piloto con más grandes premios ganados en la historia.de la Fórmula 1.<br>
                            Vettel ostenta los récords como piloto más joven en lograr puntuar en su primer Gran Premio de Fórmula 1 
                            (el Gran Premio de los Estados Unidos de 2007), el más joven en liderar una carrera (el Gran Premio de Japón de 2007),
                            y el más joven en conseguir la pole position, un podio y una victoria en un Gran Premio, récords que logró en 
                            el Gran Premio de Italia de 2008.
                        </p>
                </article>
            </div>
                
                <aside id="map-canvas">
                    
                </aside>
                
            <div>
                
                <section id="imagen4"> </section>
                <article>
                        <h3>Fernando Alonso</h3>
                        <label id="Reloj3"> </label>
                        <p class="parrafo">
                           <time datetime="2013-10-15">15 de Octubre del 2013</time><br/>
                           Piloto español ha ganado dos veces el Campeonato Mundial de Pilotos de Fórmula 1 en 2005 y 2006, ha sido subcampeón en 2010 y 2012,
                           y obtuvo un tercer puesto en 2007, habiendo competido para los equipos Minardi, Renault, McLaren y Ferrari, siendo esta su actual 
                           escudería desde 2010.<br>
                           Alonso es el cuarto piloto con más podios en la historia de la Fórmula 1 (92) y el quinto en victorias con 32 grandes premios ganados,
                           superando las 31 victorias de Nigel Mansell.2 3 Entre sus triunfos se cuentan tres en el Gran Premio de Malasia, tres en el 
                           Gran Premio de Alemania, tres en el Gran Premio de Europa (uno de ellos en España), dos en el Gran Premio de Mónaco, dos en el 
                           Gran Premio de Gran Bretaña, dos en el Gran Premio de Italia, dos en el Gran Premio de Japón, y otros dos en el Gran Premio de España.
                           Junto a Alfonso de Portago y Pedro de la Rosa, Alonso es uno de los tres españoles que han alcanzado el podio en esta competición, siendo el único que ha logrado victorias. Es además uno de los cuatro pilotos que han debutado en Ferrari con victoria en la primera carrera 
                        </p>
                </article>
            </div>
            </article>
                
        <footer>
        CopyRight © Todos los Derecho reservados      
        </footer>
    </div>
    </body>
</html>
